<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>04_新增盒子模型属性_box-sizing</title>
  <style>
    .box1{
      width: 200px;
      height: 200px;
      background-color: skyblue;
      padding: 5px;
      border: 5px solid black;
      /*让盒子的width和height变成总宽高(包括内边距和边框)*/
      /*box-sizing: border-box:压缩盒子大小,压力给到内容区,让其随着边框和内边距的值变化而变化*/
      box-sizing: border-box;
    }
  </style>
</head>
<body>
<div class="box1"></div>
</body>
</html>